<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
	import="java.util.*"%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="static/jquery/jquery-2.2.4.min.js" type="text/javascript"></script>
<link rel="stylesheet"
	href="static/bootstrap/css/3.3.6/bootstrap.min.css">
	<link rel="stylesheet" href="static/H+/css/style.min.css">
<script src="static/bootstrap/js/3.3.6/bootstrap.min.js"
	type="text/javascript"></script>
</head>
<style>
body {
	background-image:url(./static/img/background.jpg) ;
}

a:hover {
	text-decoration: none;
	color: #C40000; 
}

#timeDisplay {
	
	font-size:20px;
	font-weight:bold;
	margin-bottom:0px;
	bottom: 0;
}

#listTable {
	margin-top: 60px;
	width:1250px;
	font-family: 微软雅黑;
}

</style>


<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<body>

	<div class="nav" style="background-color:#663366;">
	<ul class="nav nav-pills" >
		<li><a href="index.jsp">Index</a></li>
		<li><a href="./showDetail">用户资料</a></li>
		<li class="active"><a href="./listCar">全部汽车</a></li>
		<li><a href="addCar.jsp">添加汽车</a></li>
		<li><a href="searchCar.jsp">搜索汽车</a></li>
		<li><a href="searchUser.jsp">搜索用户</a></li>
		<li><a href="about.jsp">关于本站</a></li>
	</ul>
	</div>
	
	<table id="listTable" class="table table-condensed" align='center' border='1'
		cellspacing='0' id="carTable" style="border-radius:5px;overflow:hidden;">
		<thead>
			<tr>
				<td>汽车编号</td>
				<td>车主姓名</td>
				<td>车牌</td>
				<td>车型</td>
				<td>颜色</td>
				<td>牌照</td>
				<td>编辑</td>
				<td>删除</td>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${cars}" var="car" varStatus="st">
				<tr>
					<td>${car.getCarId()}</td>
					<td>${car.getUserName()}</td>
					<td>${car.getCarName()}</td>
					<td>${car.getCarType()}</td>
					<td>${car.getCarColor()}</td>
					<td>${car.getCarCard()}</td>
					<td><a href="editCar?carid=${car.getCarId()}">点此修改</a></td>
					<td><a href="deleteCar?carid=${car.getCarId()}"
						onclick="deleteRow(this)">点此删除</a></td>
			</c:forEach>
		</tbody>
	</table>
	<div align="center">
				<ul class="pagination" >
				<li ><a href="?start=0">首 页</a></li>
				<li ><a href="?start=${pre}">&laquo;上一页</a></li>
				<li ><a href="?start=${next}">下一页&raquo;</a></li>
				<li ><a href="?start=${last}">末 页</a></li>
				</ul>
				</div>
	<div id="timeDisplay" class="pull-right" ></div>
</body>
<script>
	$(document).ready(function(){
		SetTableRowColor();
		
	})
	function printTime() {
		var d = new Date();
		var h = d.getHours();
		var m = d.getMinutes();
		var s = d.getSeconds();
		document.getElementById("timeDisplay").innerHTML = "当前时间   " + h + ":"
				+ m + ":" + s;
	}
	var time = setInterval(printTime, 1000);

	// 存在问题

	function deleteRow(link) {
		var b = confirm("确定删除？")
		if (!b)
			return false;

		var table = document.getElementById("carTable");
		var td = link.parentNode;
		var tr = td.parentNode;
		var index = tr.rowIndex;
		table.deleteRow(index);
	}
	function SetTableRowColor(){
		$("#listTable tr:odd").css("background-color", " #99cc99");
	    $("#listTable tr:even").css("background-color", "rgb(197,224,180)");
	}
</script>